<template>
  <globle-linear-border class="table-content">
    <controller-bar v-if="courseTableData" :data="courseTableData" @on-re-get-data="getData" ref="controllerBarRef"></controller-bar>
    <course-table class="scourse-table" v-if="courseTableData" :data="courseTableData" :open-type="openType"></course-table>
  </globle-linear-border>
</template>

<script setup lang="ts">
import { ElMessage } from 'element-plus';
import { onMounted, ref } from 'vue';
import CourseTable, { courseTableType } from '../../../components/courseTable/Index.vue';
import { useAPI } from '../../../request/api';
import { useUserStore } from '../../../store/user';
import { ICourseTable, IAllCourseParams, APIData } from '../../../type';
import ControllerBar from './components/ControllerBar.vue';
const api = useAPI();
const userStore = useUserStore();

onMounted(() => {
  getData();
});

let currentStage = 0;
const controllerBarRef = ref();
const courseTableData = ref<ICourseTable[]>();
const openType = ref(courseTableType.default);

userStore.$subscribe((args: any, states) => {
  if (currentStage != states.currentStage) {
    currentStage = states.currentStage;
    getData();
  }
});

const getData = async () => {
  const params: IAllCourseParams = { stage: userStore.currentStage, workId: userStore.userInfo.workId, department: userStore.currentDepartment };
  const res: APIData = await api.findAllByPost(params, userStore.role, 'courseTable');
  if (res.code === 200) courseTableData.value = res.data.rows;
  else ElMessage.error(res.message);
  // console.log(res);

  return res.code;
};

// const list2 = ref<ICourseTable[]>([
//   {
//     orderNum: 1,
//     weekDay: 1,
//     smallCount: 3,
//     courseName: 'Java基础',
//     tchName: '柯灵',
//     place: 'java项目一部',
//   },
//   {
//     orderNum: 1,
//     weekDay: 2,
//     smallCount: 2,
//     courseName: '静态网页',
//     tchName: '柯灵',
//     place: '项目一部',
//   },
//   {
//     orderNum: 3,
//     weekDay: 3,
//     smallCount: 2,
//     courseName: '星期三',
//     tchName: '刘佳',
//     place: '三教',
//   },
//   {
//     orderNum: 3,
//     weekDay: 4,
//     smallCount: 2,
//     courseName: '星期四',
//     tchName: '刘佳',
//     place: '四教',
//   },
// ]);
</script>

<style lang="scss" scoped>
.table-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  // justify-content: space-between;

  .scourse-table {
    padding: 16px;
    padding-top: 0;
    height: calc(100% - 60px);
  }
}
</style>
